<template>
    <div>
        <!--<my-header :title="'发票详情'" :hasTitle="true" :hasBack="true"></my-header>-->
        <header class="customHeaderStyle opacity_title" style="left: 0px;position:static;">
			<div class="go-back" @click.stop="goBack">
				<i></i>
				<i></i>
				<i></i>
			</div>
			<div class="headerCustomTitle">发票详情</div>
			<!--<div class="aui-pull-right text-del" @click.stop="clearCar" v-if="cartArray.length">删除</div>-->
		</header>
        <div class="aui-content aui-margin-b-15" style="margin-top:0.75rem;">
            <ul class="aui-list" style="">
                <div class="aui-billdetail">
                    <div style="display:inline-block;line-height: 2.2rem;">
                        <div style="text-align: left;">发票状态:</div>
                    </div>
                    <div style="display:inline-block;line-height:2.2rem;" v-if="billStatus==1&&BillDetails.serialNumber&&BillDetails.url">已开票</div>
                    <div style="display:inline-block;line-height:2.2rem;" v-if="billStatus==1&&BillDetails.serialNumber&&!BillDetails.url">开票中</div>
                    <div style="display:inline-block;line-height:2.2rem;" v-if="billStatus==1&&!BillDetails.serialNumber&&!BillDetails.url">未开票</div>
                    <div style="display:inline-block;line-height:2.2rem;" v-if="billStatus==2">{{errorMessage}}</div>
                    <div style="display:inline-block;line-height:2.2rem;" v-if="billStatus==3">{{errorMessage}}</div>
                    <div style="display:inline-block;line-height:2.2rem;" v-if="billStatus==0"></div>
                </div>
                    
                <div class="aui-billdetail">
                    <div>
                        <div style="display:inline-block;line-height: 2.2rem;">
                            <div style="text-align: left;">订单编号:</div>
                        </div>
                        <div style="display:inline-block;line-height:2.2rem;">{{orderNos}}</div>
                    </div>
                    <div>
                        <div style="display:inline-block;line-height: 2.2rem;">
                            <div style="text-align: left;">下单时间:</div>
                        </div>
                        <div style="display:inline-block;line-height:2.2rem;">{{this.getTime(creTime)}}</div>
                    </div>
                </div>
                <div class="aui-billdetail" v-if="billStatus==1&&BillDetails.serialNumber">
                    <div>
                        <div style="display:inline-block;line-height: 2.2rem;">
                            <div style="text-align: left;">发票抬头:</div>
                        </div>
                        <div v-if="BillDetails && BillDetails.invoiceTitleType == '1'" style="display:inline-block;line-height:2.2rem;">{{BillDetails.invoiceTitle}}</div>
                        <div v-if="BillDetails && BillDetails.invoiceTitleType == '2'" style="display:inline-block;line-height:2.2rem;">{{BillDetails.invoiceTitle}}</div>
                    </div>
                    <div v-if="BillDetails && BillDetails.invoiceTitleType == '1'">
                        <div style="display:inline-block;line-height: 2.2rem;">
                            <div style="text-align: left;">身份证号:</div>
                        </div>
                        <div style="display:inline-block;line-height:2.2rem;">{{BillDetails.dutyParagraphNo}}</div>
                    </div>
                    <!--<div v-if="BillDetails.orderInvoiceTitle && BillDetails.orderInvoiceTitle.invoicesTitleType == '2'">
                        <div style="display:inline-block;line-height: 2.2rem;">
                            <div style="text-align: left;">发票抬头:</div>
                        </div>
                        <div style="display:inline-block;line-height:2.2rem;">{{BillDetails.orderInvoiceTitle.companyName}}</div>
                    </div>-->
                    <div v-if="BillDetails && BillDetails.invoiceTitleType == '2'">
                        <div style="display:inline-block;line-height: 2.2rem;">
                            <div style="text-align: left;">税号:</div>
                        </div>
                        <div style="display:inline-block;line-height:2.2rem;">{{BillDetails.dutyParagraphNo}}</div>
                    </div>
                    <div>
                        <div style="display:inline-block;line-height: 2.2rem;">
                            <div style="text-align: left;">发票内容:</div>
                        </div>
                        <div style="display:inline-block;line-height:2.2rem;">{{BillDetails.invoiceContext}}</div>
                    </div>
                </div>
                <div  class="aui-billdetail" style="text-align: right;line-height:2.6rem;" v-if="BillDetails.url">
                    <div class="lookBill" @click='lookBill(BillDetails.url)'>
                        保存到本地
                        <!-- <a :href='BillDetails.url' download="" style="color:white">保存到本地</a> -->
                    </div>
                    <div class="setMeail" @click="setEmail" ><i class="icon njfont nj-youjianyouxiang" style="font-size:0.72rem;"></i>&nbsp;发送邮箱</div>
                </div>
            </ul>
        </div>
        <mt-popup ref="BillDetail" v-model="popupVisible" popup-transition="popup-fade" modal="true" closeOnClickModal="true" class="setEmail">
			<Bill-SetEmail  @hideModal="updateType" :orderNos="BillDetails.orderNo ? BillDetails.orderNo:''" :parentOrderNo = "ParentOrderNo ? ParentOrderNo : ''"></Bill-SetEmail>
		</mt-popup>
    </div>
</template>
<script>
//	import MyHeader from "../header";
    import axios from "axios";
    import { Popup ,MessageBox} from 'mint-ui';
    import BillSetEmail from "../../real-components/BillSetEmail";
    import { mapState, mapGetters, mapMutations } from "vuex";
//  import {getBills} from "../../api";
    // import api from "../../api";
	// import ButtonToTop from '../../real-components/ButtonToTopForTest';
	export default {
		data(){
			return {
                // aboutData:null
                isChecked : true,
                CheckedElect : false,
                contentShows : false,
                popupVisible : false,
                orderNo : "",
                BillDatas:"",
                imgDwonLoad:"",
                orderNos:"",
                ParentOrderNo:"",
                creTime:'',//订单创建时间
                BillDetails:"",
                billStatus:0,
                errorMessage:'',//返回的信息
                num:'',
			}
		},
		computed: {
	      ...mapGetters('hzh', [
	        'saveBillshead',
	      ]),
//	      getBillDatas(){
//	      	this.ParentOrderNo = this.$router.history.current.query.ParentOrderNo;
//	      	return this.getBillDetail(this.ParentOrderNo)
//	      }
	    
	    },
		components:{
//			"my-header":MyHeader,
            // ButtonToTop,
            'mt-popup': Popup,
            "Bill-SetEmail": BillSetEmail,
		},
		methods: {
			goBack() {
                if(this.$route.query.orderStatus == null) {
					window.history.go(-1);
				} else {
					this.$router.push({
						path: 'order',
						query: {
							orderStatus: this.num
						}
					})
				}
			},
            setEmail() {
//              this.popupVisible = true;
                let that = this;
                MessageBox({
                    $type:'prompt',
                    title: '提示',
                    message: '请输入邮箱地址',
                    showCancelButton: true,
                    showInput:true,
                    closeOnClickModal:false,
                }).then(({ value, action }) => {
				  	//邮箱验证
					var regEmail=/^\S+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
					if(!regEmail.test(value)){
                        MessageBox.alert("邮箱格式不正确").then(action=>{
                            that.setEmail();
                        });
		                return;
		            }
		        	var sessionId = localStorage.getItem('sessionId');
		            let email = value;
		            let parentOrderNo = this.ParentOrderNo;
		            var url = window.api.trade_host + "/orderElectronicInvoice/sendMail/" + parentOrderNo +"/"+ email;
		//			var url = "http://test.mall.yn.weilian.cn"+ api.deleteBills;
		            var config = {
		               url :url,
		//             data:datas,
		               method:"PUT",
		               headers: {'sessionId': sessionId},
		            }
		            axios(config).then((res) => {
		                console.log("guojilaoa666666666666", res)
		                if(res.data.returnCode === 1){
		                    MessageBox.alert("发送成功").then(action => {
		//					  	this.$store.dispatch('hzh/GetBillheads');//查询发票抬头
		//					  	this.$router.push('/main/HeadManagement');
							  	// this.deteles();
							});
		                    
		                }else if(res.data.returnCode === 0){
		                	MessageBox.confirm(res.data.msg)
		//              	.then(action => {
		//	                   this.$router.push('/login'); 
		//	                });
		                }
		            
		            })
				});
            },
            updateType(data) {
				this.popupVisible = data.detele;//改变了父组件的值 
			},
			lookBill(val){
				// await this.$store.dispatch('hzh/GetBillheads');
				// console.log("aiyaa/////////",this.BillDetails)
				// window.location.href = this.BillDetails.url;
				// this.BillDetails.forEach(items => {
				// 	if(items.orderNos == this.orderNos){
				// 		this.imgDwonLoad = items.Url
				// 	}
				// })
				// this.$router.push(this.BillDetails.url);
                cordova.exec(success, fail, "InvoicePlugin", "saveToLocal", [{url:val}]);
                function success(res){
                    console.log(res,'保存到本地')
                }
                function fail(res){

                }

			},
			getBillDetail(val) {
				return new Promise((resolve,reject)=>{
					var sessionId = localStorage.getItem('sessionId');
		            var url = window.api.trade_host + "/orderElectronicInvoice/selectElectronicInvoice/" + val;
		            var config = {
		               url,
		               method: "GET",
		               headers: {sessionId},
		            }
		            console.log("bbbbbbbbbb9",sessionId)
		            axios(config).then((res) => {
		                console.log("uuuuuuuuuuuiiiiiiii", res)
		                if(res.data.returnCode === 1){
                            this.billStatus = 1;
                            this.BillDetails = res.data.data[0];
                            console.log("billdetaild", this.BillDetails)
	//						this.$store.dispatch('hzh/SaveClickAddress', res.data.data);
							resolve(true)
		                }else if(res.data.returnCode === 0){
                            this.billStatus = 0;
                            // if(res.data.data){
                            //     this.BillDetails = res.data.data[0];
                            // }else{
                            //     MessageBox.alert(res.data.msg)
                            // }
                            MessageBox.alert(res.data.msg)
                           
		                	resolve(false)
	//	                	.confirm(res.data.errmsg).then(action => {
	//		                   this.$router.push('/login');
	//		                });
		                }else if(res.data.returnCode === 2){
                            this.billStatus = 2;
                            this.errorMessage = res.data.msg;
		                	resolve(false)

                        }else if(res.data.returnCode === 3){
                            this.billStatus = 3;
                            this.errorMessage = res.data.msg;
		                	resolve(false)

                        }
		            })
	            })
            },
            getGiftBillDetail(val){
                //获取礼品的发票详情
                return new Promise((resolve,reject)=>{
					var sessionId = localStorage.getItem('sessionId');
		            var url = window.api.trade_host + "/orderElectronicInvoice/selectGiftCardElectronicInvoice/" + val;
		            var config = {
		               url,
		               method: "GET",
		               headers: {sessionId},
		            }
		            axios(config).then((res) => {
		                if(res.data.returnCode === 1){
                            this.billStatus = 1;
                            this.BillDetails = res.data.data[0];
	//						this.$store.dispatch('hzh/SaveClickAddress', res.data.data);
							resolve(true)
		                }else if(res.data.returnCode === 0){
                            this.billStatus = 0;
                            // if(res.data.data){
                            //     this.BillDetails = res.data.data[0];
                            // }else{
                            //     MessageBox.alert(res.data.msg)
                            // }
                            MessageBox.alert(res.data.msg)
                           
		                	resolve(false)
	//	                	.confirm(res.data.errmsg).then(action => {
	//		                   this.$router.push('/login');
	//		                });
		                }else if(res.data.returnCode === 2){
                            this.billStatus = 2;
                            this.errorMessage = res.data.msg;
		                	resolve(false)

                        }else if(res.data.returnCode === 3){
                            this.billStatus = 3;
                            this.errorMessage = res.data.msg;
		                	resolve(false)

                        }
		            
		            })
	            })

            },
			//转换时间格式
		    getTime(param){
		        let date = new Date(param);
		        let year = date.getFullYear();
		        let month = checkTime(date.getMonth() + 1);
		        let day = checkTime(date.getDate());
		        let hour = checkTime(date.getHours());
		        let min = checkTime(date.getMinutes());
		        let sec = checkTime(date.getSeconds());
		
		        function checkTime(i) {
		          if (i < 10) {
		            i = '0' + i;
		          }
		          return i;
		        }
		
		        return year + '-' + month + '-' + day + ' ' + hour + ':' + min + ':' + sec;
		    }
			
        },
        async created() {
            if (this.isChecked) {
                this.contentShows = false;
            }
            this.orderNos = this.$route.query.orderNo;
            this.storeOrderNo = this.$route.query.storeOrderNo;
            this.ParentOrderNo = this.$route.query.ParentOrderNo;
            this.creTime = this.$route.query.creTime;
            this.num = this.$route.query.orderStatus;
            if(this.$route.query.giftCard){
                await this.getGiftBillDetail(this.ParentOrderNo)
            }else{
                await this.getBillDetail(this.ParentOrderNo);
            }
        },
        mounted() {
            
        },
        beforeDestroy() {
			MessageBox.close(false);
		},
	}
</script>

<style>
.customHeaderStyle{
		position: relative;
		background: #fff;
		min-height: 3rem;
		border-bottom: 1px solid #eaeaea;
		color: #444;
		font-weight: 700;
		left: 0;
		top: 0;
		line-height: 2.25rem;
		/* z-index: 2; */
		width: 100%;
		font-size: .9rem;
		text-align: center;
		margin: 0;
		padding: 0;
	}
	.headerCustomTitle{
		overflow: hidden;
		right: 6rem;
		font-weight: 500;
		min-height: 2.25rem;
		position: absolute;
		margin: 0;
		text-align: left;
		white-space: nowrap;
		left: 3rem;
		width: auto;
		text-overflow: ellipsis;
		z-index: 2;
		font-size: 1.1rem;
		margin-top: .35rem;
		top: 1px;
	}
.aui-billdetail{
    text-align: left;
    border-bottom: 1px solid #eaeaea;
    padding:0 0.75rem;
}
.lookBill{
    /* border: 1px solid rgb(153, 153, 153); */
    background-color: #EF5423;
    border-radius: 0.34rem;
    width: 100%;
    height: 1.8rem;
    /* display: inline-block; */
    line-height: 1.8rem;
    text-align: center;
    color: white;
    margin-top:0.5rem; 
}
.setMeail{
    border: 1px solid rgb(153, 153, 153);
    background-color: white;
    border-radius: 0.34rem;
    width: 100%;
    height: 1.8rem;
    /* display: inline-block; */
    line-height: 1.8rem;
    text-align: center;
    color:#000000;
    margin: 0.5rem 0;
}
.setEmail{
    width: 80%;
	height: 30%;
	border-radius: 0.4rem;
}
.mint-msgbox-wrapper{
    width: 0 !important;
    height: 0 !important;
}
</style>
